<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="utf-8">
	<title>bootstrap</title>
	<link rel="stylesheet" type="text/css" href="./bootstrap/bootstrap.css">
	<link rel="stylesheet" type="text/css" href="./toastr/toastr.min.css">
	<style>
   .type-menu-li {
    position: relative;
    padding: 2px 5px 2px 30px;
    cursor: pointer;
   } 
   .type-menu-li:hover {
    background: #efefef;
   }
   .type-menu-li:before {
    content: '';
    position: absolute;
    top: 50%;
    left: 10px;
    margin-top: -7px;
    width: 14px;
    height: 14px;
    box-sizing: border-box;
    border: 3px solid currentColor;
   }
  </style>
</head>
<body>

<div class="alert alert-success">测试笑嘻嘻嘻嘻</div>

<button onclick="showCs()">测试</button>

<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#systemModal">显示弹窗</button>

<br/>
<div class="dropdown" style="margin-left:200px;">
  <button id="dLabel" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    添加
    <span class="caret"></span>
  </button>
  <ul id="typeDropMenu" class="dropdown-menu" aria-labelledby="dLabel"></ul>
</div>


<div class="modal fade" id="systemModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="myModalLabel">系统设置</h4>
      </div>
      <div class="modal-body">
        <div style="display:flex;align-items: center;margin-bottom: 15px;">
        	<div style="width:6em;text-align: right;">单位名称：</div>
        	<div>
        		<input id="orgName" type="text" class="form-control" placeholder="请输入" style="width:300px;"/>
        	</div>
        </div>
        <div style="display:flex;align-items: center;margin-bottom: 15px;">
        	<div style="width:6em;text-align: right;">报告医生：</div>
        	<div>
        		<input id="doctorName" type="text" class="form-control" placeholder="请输入" style="width:300px;"/>
        	</div>
        </div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
        <button type="button" class="btn btn-primary" onclick="saveSystemModal()">保存</button>
      </div>
    </div>
  </div>
</div>


<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<script src="./bootstrap/bootstrap.js"></script>
<script src="./toastr/toastr.min.js"></script>
<script>
	toastr.options.positionClass = 'toast-top-center';
	toastr.options.timeOut = 1000;


var config = {
          "胸膜增厚": "rgb(255, 0, 255)",
          "纤维灶": "rgb(220, 20, 60)",
          "钙化": "rgb(148, 0, 211)",
          "骨折": "rgb(123, 104, 238)",
          "肺不张": "rgb(0, 0, 205)",
          "肿块": "rgb(30, 144, 255)",
          "结节": "rgb(184, 134, 11)",
          "肺气肿": "rgb(0, 139, 0)",
          "气胸": "rgb(139, 35, 35)",
          "PICC": "rgb(218, 165, 32)",
          "积液": "rgb(255, 140, 0)",
          "积气": "rgb(0, 0, 0)",
          "实变": "rgb(85, 107, 47)",
          "术后金属": "rgb(95, 158, 160)",
          "膈下游离气体": "rgb(9,113,175)",
          "肠道积气扩张": "rgb(4,248,194)",
          "肠道积液液平": "rgb(148, 0, 211)",
          "泌尿系统结石": "rgb(108,227,33)"

      }

  function setDownList() {
    let html = '';
    for(let key in config) {
      html += `<li class="type-menu-li" style="color:${config[key]}">${key}</li>`;
    }
    $('#typeDropMenu').html(html);
  }    
  setDownList();

	function showCs() {
		$.ajax({
        url: "http://localhost:8088/xray/getSystemSettings",
        type: "get",
        success: function (res) {//请求成功完成后要执行的方法
            let data = JSON.parse(res.data);
            let obj = data[0].fields;
            $('#orgName').val(obj.org_name);
            $('#doctorName').val(obj.doctor);
        }
    })
	}

	function saveSystemModal() {
        $('#systemModal').modal('hide');
		// let orgName = $('#orgName').val();
		// let doctorName = $('#doctorName').val();
		// if(!orgName) {
		// 	toastr.warning('请输入单位名称');
		// 	return;
		// }
		// if(!doctorName) {
		// 	toastr.warning('请输入报告医生');
		// 	return;
		// }
		// $.ajax({
  //           url: "http://localhost:8088/xray/updateSystemSettings/",//json文件位置，文件名
  //           type: "POST",
  //           data: {
  //           	org_name: orgName,
  //           	doctor: doctorName,
  //           },
  //           success: function (res) {//请求成功完成后要执行的方法
  //             toastr.success('保存成功');
  //           }
  //       })
	}

</script>
</body>
</html>